<template>
	<view :data-theme='theme()' :class="theme() || ''" class="login-container" :style="'height: '+phoneHeight+'px;'">
		<view class="skip" @click="gotoPage('/pages/index/index')">跳过</view>
		<view class="bgbox">
			<view class="box">
				<image :src="lognimg" mode="aspectFit"></image>
			</view>
			<view class="btns p-30-75 mt40"><button @click="formSubmit('mobile')">手机号码安全登录</button></view>
			<view class="wxbtns p-30-75 mt40" v-if="wxShow"><button @click="formSubmit('wx')">一键登录</button></view>
			<view class="detlfixed">
				<view @click="isRead=!isRead" class="d-s-c gray6 p-0-75 mt40 tc ml30">
					<view :class="isRead?'active agreement':'agreement'"></view>我已阅读并接受<text class="dominant"
						@click.stop="xieyi('service')">《用户协议》</text>和<text class="dominant"
						@click.stop="xieyi('privacy')">《隐私政策》</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				phoneHeight: 0,
				isRead: false,
				service: '', //服务协议
				privacy: '', //私隐协议
				lognimg: '',
				wxShow: true, //是否显示微信登录

			}
		},
		onLoad(option) {

		},
		mounted() {
			// #ifdef H5
			this.wxShow = uni.getStorageSync('mpState') == 1 ? true : false;
			// #endif
			this.lognimg = uni.getStorageSync('logoIndeximage')
		},
		onShow() {
			this.init();
			this.getData();
		},
		methods: {
			/*初始化*/
			init() {
				let that = this;
				uni.getSystemInfo({
					success(res) {
						that.phoneHeight = res.windowHeight;
					}
				});
			},
			//协议
			getData() {
				let that = this;
				that._get('index/policy', {}, function(res) {
					that.service = res.data.service;
					that.privacy = res.data.privacy;
				});
			},
			xieyi(type) {
				let url = '';
				if (type == 'service') {
					url = this.service;
				} else {
					url = this.privacy;
				}
				uni.navigateTo({
					url: '/pages/webview/webview?url=' + url
				});
			},
			formSubmit(type) {
				if (!this.isRead) {
					uni.showToast({
						title: '请同意并勾选协议内容',
						duration: 2000,
						icon: 'none'
					});
					return;
				}
				console.log('登录方式', type);
				if (type == "mobile") {
					// #ifdef H5
					this.gotoPage("/pages/login/weblogin?isRead=true");
					// #endif
					// #ifdef APP
					this.gotoPage("/pages/login/openlogin?isRead=true", 'redirect');
					// #endif
					// #ifdef MP-WEIXIN
					this.gotoPage("/pages/login/weblogin?isRead=true");
					// #endif

				} else if (type == "wx") {
					// #ifdef  H5
					if (this.isWeixin() && uni.getStorageSync('mpState') == 1) {
						window.location.href = this.websiteUrl + '/api/front/user/userMp/login?appId=' + this.getAppId() +
							'&refereeId=' + uni.getStorageSync('refereeId');
					} else {
						uni.showToast({
							title: '请在微信浏览器使用',
							duration: 2000,
							icon: 'none'
						});
						return;
					}
					// #endif
					// #ifdef APP
					this.login();
					// #endif
					// #ifdef MP-WEIXIN
					let wxOpen = uni.getStorageSync('wxOpen');
					if (wxOpen) {
						// this.gotoPage("/pages/login/login");
						//使用此方法跳转,wx.hideHomeButton才会生效
						wx.reLaunch({
							url: '/pages/login/login'
						})
					}
					// #endif
				}
			},

			login() {
				let that = this;
				plus.oauth.getServices(
					function(servies) {
						let s = servies[0];
						if (!s.authResult) {
							s.authorize(
								function(e) {
									uni.showLoading({
										title: '登录中',
										mask: true
									});
									that._post(
										'user/userOpen/login', {
											code: e.code,
											source: 'app'
										},
										result => {
											console.log('open login------------------');
											console.log(result);
											// 记录token userId
											uni.setStorageSync('token', result.data.token);
											uni.setStorageSync('userId', result.data.loginUserVo.userId);
											// 获取登录前页面
											let url = uni.getStorageSync('currentPage');
											let pageOptions = uni.getStorageSync('currentPageOptions');
											if (Object.keys(pageOptions).length > 0) {
												url += '?';
												for (let i in pageOptions) {
													url += i + '=' + pageOptions[i] + '&';
												}
												url = url.substring(0, url.length - 1);
											}
											that.gotoPage(url);
										},
										false,
										() => {
											uni.hideLoading();
										}
									);
								},
								function(e) {
									console.log('登陆认证失败!');
									uni.showModal({
										title: '认证失败1',
										content: JSON.stringify(e)
									});
								}
							);
						} else {
							console.log('已经登陆认证');
						}
					},
					function(e) {
						console.log('获取服务列表失败：' + JSON.stringify(e));
					}
				);
			},
			//apple登录
			appleLogin() {
				let that = this;
				uni.login({
					provider: 'apple',
					success: function(loginRes) {
						// 登录成功
						uni.getUserInfo({
							provider: 'apple',
							success(res) {
								if (res.errMsg !== 'getUserInfo:ok') {
									return false;
								}
								uni.showLoading({
									title: '正在登录',
									mask: true
								});
								that._postBody(
									'user/userapple/login', {
										invitationId: that.invitationId,
										openId: res.userInfo.openId,
										nickName: res.userInfo.fullName.giveName ? res.userInfo
											.fullName.giveName : '',
										refereeId: uni.getStorageSync('refereeId'),
										source: 'apple'
									},
									result => {
										// 记录token userId
										uni.setStorageSync('token', result.data.token);
										uni.setStorageSync('userId', result.data.loginUserVo
											.userId);
										// 获取登录前页面
										let url = uni.getStorageSync('currentPage');
										let pageOptions = uni.getStorageSync('currentPageOptions');
										if (Object.keys(pageOptions).length > 0) {
											url += '?';
											for (let i in pageOptions) {
												url += i + '=' + pageOptions[i] + '&';
											}
											url = url.substring(0, url.length - 1);
										}
										that.gotoPage(url);
									},
									false,
									() => {
										uni.hideLoading();
									}
								);
							}
						});
					},
					fail: function(err) {
						// 登录失败
						console.log('登录失败');
						console.log(err);
					}
				});
			},


		}

	}
</script>

<style lang="scss" scoped>
	.login-container {
		position: relative;
		padding: 30rpx;

		.bgbox {
			background-color: #ffffff;
			padding-bottom: 40rpx;
			border-radius: 20rpx;
		}
	}

	.box {
		min-height: 40vh;

		image {
			margin: auto;
			display: block;
			text-align: center;
			border-radius: 50%;
		}
	}

	.btns button {
		height: 90rpx;
		line-height: 90rpx;
		font-size: 34rpx;
		border-radius: 45rpx;
		@include background_color('background_color');
		color: #ffffff;
		width: 85vw;
		margin: auto;
	}

	.wxbtns button {
		height: 90rpx;
		line-height: 90rpx;
		font-size: 34rpx;
		border-radius: 45rpx;
		background-color: #1AAD19;
		width: 85vw;
		margin: auto;
		color: #ffffff;
	}

	.agreement {
		border-radius: 50%;
		width: 28rpx;
		height: 28rpx;
		border: 2rpx solid;
		@include border_color('border_color');
		background: #fff;
		position: relative;
		margin-right: 10rpx;
		box-sizing: border-box;
	}

	.agreement.active::after {
		content: '';
		width: 16rpx;
		height: 16rpx;
		@include background_color('background_color');
		border-radius: 50%;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		margin: auto;
	}

	.detlfixed {
		position: fixed;
		width: 100%;
		bottom: 10%;
	}

	.skip {
		position: absolute;
		top: 50rpx;
		right: 60rpx;
		font-size: 28rpx;
		color: #999999;
		z-index: 10;
	}
</style>